<template>
  <div class="page-a">
    <el-input v-model="localTitle" placeholder="请输入标题" @input="updateTitle" />
  </div>
</template>

<script setup>
import { ref, watch } from 'vue';

const props = defineProps({
  title: String, // 接收父组件传递的 title
});

const emit = defineEmits(['update:title']); // 定义 emit 事件

const localTitle = ref(props.title); // 本地数据

// 监听父组件传递的 title 变化
watch(
    () => props.title,
    (newVal) => {
      localTitle.value = newVal;
    }
);

// 更新父组件的 title
const updateTitle = () => {
  emit('update:title', localTitle.value);
};
</script>